導航基礎 ipad&iphone Side bar& Tab bar (模式)

Flat and hierarchical 扁平結構和層級結構

扁平導航使用結構相對扁平的頂級內容,而層次導航用於組織和遍歷可能深入的內容層次。

扁平導航使用的是結構相對平坦的頂級內容。即使某些部分內容較多,主要目的地的權重也差不多。這樣的應用通常用標籤欄來導航,比如照片或音樂應用。

扁平結構側邊欄資訊佈局設計

A 建議把應用程式中最重要的地方在頂部。確保側邊欄和標籤欄中有相同的頂級專案。

在螢幕較小的裝置上(比如iPhone)或螢幕寬度較窄的情況下,不要使用側邊欄Sidebars。側邊欄應轉換為標籤欄Tab bars。

不要在同一檢視中混用側邊欄和標籤欄。側邊欄和標籤欄是相同內容的兩種不同展示方式,混用會讓導航結構變得混亂。

B 將較長的內容列表(使用者生成的內容)放在放在側邊欄主要導航的下方。如照片應用中的相簿或音樂應用中的播放列表。

將其巢狀在可摺疊的標題下。這將確保你在頂級目的地和下方內容之間保持正確的層次結構。

如果建立了兩種方式來訪問相同的內容,例如透過一個頂級專案,也透過下面的資料夾,那也完全沒問題。

在側邊欄中使用輪廓圖示,但在標籤欄中保留實心圖示。

C 如果側邊欄變得過於繁雜,需要大量滾動和展開部分才能找到內容,它就不再起到快速導航的作用了。

D 如果你的側邊欄內容是使用者可配置的,可以新增按鈕。按鈕放在每個可配置部分的底部。

層次導航常見於需要組織和遍歷可能深入的內容層次的應用程式。

層級結構側邊欄資訊佈局設計

A 將頂級內容放在側邊欄的頂部。可以在這裡堆疊多個頂級專案。

然後在下面新增通往應用中最重要地方的快捷方式。

B 側邊欄應該保留為訪問層級結構中最重要地方的起點。不適合瀏覽深層次的巢狀層級內容。整個內容樹不應該被強行放入側邊欄。